<template>
    <div>
        <!-- ElementUI:对话框 -->
        <el-dialog title="新建时控" width="1000px" :visible.sync="obj.isshow" @close="closedev()">
            <div style="display:flex;flex-wrap:wrap">
                <div class="switch"  style="margin-left: 50px;margin-top:10px" v-for="(item, num) in switchlist" :key="num">
                    <span style="display: inline-block;width:40px">sh{{item.address}}</span> 
                    <el-time-picker
                        style="width: 120px;"
                        v-model="item.openTime"
                        placeholder="开始时间"
                        value-format="HH:mm:ss">
                    </el-time-picker>
                    ——
                    <el-time-picker
                        style="width: 120px;"
                        v-model="item.closeTime"
                        placeholder="结束时间"
                        value-format="HH:mm:ss">
                    </el-time-picker>
                </div>
                <!-- <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh2
                    <el-time-picker
                        is-range
                        v-model="value2"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch"  style="margin-left: 50px;margin-top:10px">
                    sh3
                    <el-time-picker
                        is-range
                        v-model="value3"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh4
                    <el-time-picker
                        is-range
                        v-model="value4"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch"  style="margin-left: 50px;margin-top:10px">
                    sh5
                    <el-time-picker
                        is-range
                        v-model="value5"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh6
                    <el-time-picker
                        is-range
                        v-model="value6"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch"  style="margin-left: 50px;margin-top:10px">
                    sh7
                    <el-time-picker
                        is-range
                        v-model="value7"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh8
                    <el-time-picker
                        is-range
                        v-model="value8"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch"  style="margin-left: 50px;margin-top:10px">
                    sh9
                    <el-time-picker
                        is-range
                        v-model="value7"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh10
                    <el-time-picker
                        is-range
                        v-model="value8"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch"  style="margin-left: 50px;margin-top:10px">
                    sh11
                    <el-time-picker
                        is-range
                        v-model="value7"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div>
                <div class="switch" style="margin-left: 50px;margin-top:10px">
                    sh12
                    <el-time-picker
                        is-range
                        v-model="value8"
                        range-separator="至"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        placeholder="选择时间范围">
                    </el-time-picker>
                </div> -->
            </div>
            <div style="margin-bottom: 20px;margin-top:20px">
                <el-button v-if="btnshow" style="margin-left: 400px;" size="mini"  type="primary" @click="settask">确认</el-button>
                <el-button v-else style="margin-left: 400px;" size="mini"  type="primary" @click="settasks">确认</el-button>

                <el-button size="mini" @click="close" >取消</el-button>
            </div>
            <!-- <div style="display: flex;width: 500px;flex-wrap: wrap;line-height">
                <div v-for="(item,num) in devlist" :key="num" @click="controldev(item,num)" style="width:120px;height:50px">
                    <span style="line-height: 50px;">{{ num+1 }}:</span>
                    <i v-if="item == '1'" class="el-icon-s-opportunity" style="font-size: 30px;color:#ff8800"></i>
                    <i v-else class="el-icon-s-opportunity" style="font-size: 30px;color:#999"></i>
                </div>
            </div> -->
        </el-dialog>
    </div>
</template>
  
<script>
import { number } from "echarts";
import {getdevid,setdev,gettasklist,settask,getalltask,settasks } from "../../../request/api";
import { successmsg, failmsg } from "../../../tools/tools";

export default {
  props:['centralizedCode','code','obj'],
    data() {
        return {
            btnshow:true,
            // 展示数据
            switchlist:[],
            // shlist:[
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:1},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:2},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:3},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:4},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:5},
            // {openTime:'11:00:00',closeTime:'00:11:00',adress:6},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:7},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:8},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:9},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:10},
            // {openTime:'00:00:00',closeTime:'00:00:00',adress:11},
            // {openTime:'11:00:00',closeTime:'00:11:00',adress:12}],        
            dobj:{
                centralizedCode: "",
                code: 1,
                switchStatus: true,
                loopList: []
            },
            devobj:{},
            devlist:[],
            value: '',
            curId: '',
        };
    },

    methods: {
        close(){
            this.obj.isshow = false; 
        },
        // 多选定时
        settasks(){
            settasks(this.switchlist).then(d=>{
                // console.log(d);
                this.obj.isshow = false;
            })
        },
        // 确认定时
        settask(){
            settask(this.switchlist).then(d=>{
                // console.log(d);
                this.obj.isshow = false;
            })
        },
        // 获取任务列表
        gettasklist(arr){
            if(arr.length>1){
                getalltask({"centralizedCode":arr[0].centralizedCode}).then(d=>{
                this.switchlist = d.data
                this.btnshow = false
            })
            }else{
                gettasklist({"centralizedCode":arr[0].centralizedCode,"deviceCode":arr[0].code}).then(d=>{
                this.switchlist = d.data
                this.btnshow = true
            })
            
            }
           
        
        },
        closedev(){
            // this.$emit('closetime')
            // this.$emit('refreshdev')
            // clearInterval(timers)
        },
    },

    mounted() {
        // this.gettasklist()
        // this.curId = this.devid
        // console.log(this.curId,'222');
        // this.getAllMenu();
        // console.log(this.formInfo, 123123);
    },
    // watch: {
    //   device() {
    //     if (this.devobj.id === this.device.id) {
    //       const switchList = this.device.switchList;
    //       this.devlist = switchList.map(item => (item.switchStatus ? "1" : "0"));
    //     }
    //   }
    // },
}
</script>
  
<style>
.switch{
    width: 360px;
}
</style>